<template>
  <div>
<el-input v-model="msg"></el-input>
<el-button @click="submit">提交</el-button>

聊天内容展示：
<ul>
  <li v-for="i in melist">{{i}}

  </li>
</ul>
  </div>
</template>

<script>
export default {
  data(){
    return{
      userid:"",
      ws:null,
      msg:'',
      username:"",
      melist:[]
    }
  },
  methods:{
    imitW(){
      
      this.userid = this.$route.query.userid,
     
      this.username = '用户'+this.userid
      this.ws = new WebSocket("ws://localhost:8000/ws?userid="+this.userid+"&name="+this.username)
      this.ws.onopen = function(){
        alert('success')

      }
      this.ws.onmessage=(msg)=>{
        var mes =JSON.parse(msg.data) 


        this.melist.push(mes['mes'])


      }
    },
    submit(){
      var mes = this.username+"说:"+this.msg
      this.melist.push(mes)
      var sendmes = JSON.stringify({'id':'kefu','mes':mes})
      this.ws.send(sendmes)
    }
  },
  mounted(){
    this.imitW()
  }

}
</script>

<style>

</style>